<template>
  <div class="contene">
    <div class="contene_app" v-for="item in groupBuylist">
      <!--          {{item}}-->
      <!--          <div class="app_top_wrap">-->
      <!--            <text class="app_top" style="padding-left: 55px;">{{ item.name }}</text>-->
      <!--          </div>-->
      <div class="app" v-for="data in item.itemList" @click="gotobuy(data,item)">
        <div class="app_left" style="margin-bottom: 25px">
          <image style="width:200px;height:200px;margin-top: 15px;" :src="data.thumbnail"/>
        </div>
        <div class="app_right">
          <text class="app_right_text">{{ data.name }}</text>
          <text  class="app_right_text_sub">{{data.subTitle}}</text>
          <text class="food-item-money">￥{{ data.price != null ? data.price : "0" }}</text>
        </div>
      </div>
    </div>

  </div>
</template>
<script>
import {list} from "../../../../api/groupBuy";
import myNavbar from '../../../../components/myNavbar/myNavbar.vue'
import {getInfo} from "../../../../api/user";

export default {
  components: {
    myNavbar
  },
  data() {
    return {
      statusBarHeight: eeui.getStatusBarHeightPx(),
      groupBuylist: [],
      pageSize: 20,
      pageNum: 1,
      name: "",
      refreshTitle: '释放刷新页面...',
      refreshing: false,
      loadinging: false,
      realNameStatus:''
    };
  },
  created() {
    this.groupBuyclick();
    this.getPersonalInformation();
  },
  methods: {
    getPersonalInformation(){
      getInfo().then(res=>{
        this.realNameStatus = res.data.userInfo.realNameStatus
      })
    },
    onloading(event) {
      console.log("揍你");
      this.loadinging = true
      setTimeout(() => {
        this.loadinging = false
        this.pageNum += 1
        this.groupBuyclick()
      }, 1000)
    },
    onpullingdown(event) {
      console.log('下拉了')
      this.refreshTitle = '释放刷新页面...'
    },
    onrefresh(event) {
      var _this = this
      console.log('下拉完成')
      this.refreshing = true
      this.refreshTitle = '加载中...'
      setTimeout(() => {
        _this.pageNum = 1;
        _this.groupBuylist = []
        _this.groupBuyclick()
        _this.refreshing = false
      }, 2000)
    },
    gotobuy(data, item) {
      console.log(this.realNameStatus)
      if(this.realNameStatus != 2){
        eeui.toast('请先实名认证')
        eeui.openPage({
          params: obj,
          url: 'root://pages/member/realName/index.js',
          statusBarType: 'immersion',
          statusBarStyle: false,
        })

        return false
      }
      var obj = {
        productId: data.productId,
        groupId: item.id,
        productType: 'group',
        priceBox: data.price
      }
      eeui.openPage({
        params: obj,
        url: 'root://pages/goods/product/groupBuydetails.js',
        statusBarType: 'immersion',
        statusBarStyle: false,
      })
    },
    groupBuyclick() {
      list({
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        mchId: this.getGlobalData().mchId,
        type: 2
      }).then((res) => {
        res.data.data.forEach(element => {
          this.groupBuylist.push(element)
        });
        ;
      });
    },
  },
};
</script>
<style>
.contene {
  flex: 1;
  background-color: rgba(248, 248, 248, 0.8);
  /*background-color: orange;*/
}

.contene_app {
  margin-top: 10px;
}

.app {
  width: 710px;
  display: flex;
  flex-direction: row;
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 10px;
  background-color: #fff;
  border-radius: 20px;
  margin-left: 20px;
}

.app_top {
  font-size: 32px;
  color: #333333;
  margin-top: 10px;
  padding-left: 40px;
}

.app_left {
  width: 200px;
  height: 210px;
  margin-top: 10px;
  padding-bottom: 10px;
  border-radius: 5px;
}

.app_right {
  padding-top: 10px;
  padding-left: 10px;
  padding-right:10px;
  padding-bottom: 10px;
  width: 500px;
  height: 230px;
  display: flex;
  justify-content: space-between;
  /*background-color: yellowgreen;*/
}


.app_right_text {
  margin-left: 10px;
  margin-top: 10px;
  color: #333333;
  font-size: 28px;
  font-family: PingFang SC;
  font-weight: 400;
  max-height: 80px;
  color: rgba(26, 26, 30, 1);
  line-height: 40px;
  lines: 2;
  text-overflow: ellipsis;
}
.app_right_text_sub{
  margin-left: 10px;
  margin-top: 10px;
  font-size: 24px;
  font-family: PingFang SC;
  font-weight: 400;
  max-height: 80px;
  color: red;
  line-height: 40px;
  lines: 2;
  text-overflow: ellipsis;

}

.food-item-money {
  font-weight: bold;
  color: #f01414;
  font-size: 30px;
  margin-right: 16px;
  margin-left: 10px
}

.indicator-text {
  color: #888888;
  font-size: 42px;
  text-align: center;
}

.loading {
  width: 750px;
  /* height: 250px; */
  display: -ms-flex;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
}
</style>
